<%--
  Created by IntelliJ IDEA.
  User: lingshao
  Date: 2020/9/14
  Time: 10:50
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>考试页面</title>
    <!--导入layui-->
    <link rel="stylesheet" href="../layui/layui/css/layui.css">
    <script src="../layui/layui/layui.js" charset="utf-8"></script>
    <!--设置样式-->
    <style type="text/css">
        #head{
            width: 100%;
            height: 9%;
            background-color: #99CCFF;
            position: center;
        }
        span{
            font-size: 30px;
            font-family: 微软雅黑;
        }
        img{
            width: 80px;
            height: 80px;
            margin-left: 2%;
        }
        #headexa{
            width: 100%;
            height: 5%;
            background-color: #0052A3;
            color: #F8F8F8;
            /*border: 1px solid black;*/

        }
        #midde{
            width: 100%;
            height: 81%;
            background-color: #E9E7E7;

        }

        #chaque{
            width: 100%;
            height: 10%;
            position: absolute;
            bottom: 1px;
            background-color: #99CCFF;
            text-align: center;
        }
        #paperTitle{
            width: 60%;
            height: 100%;
            /*border: #0052A3 1px solid;*/
            float:left;
            text-align: center;
            color: #F8F8F8;
            font-size: 23px;
            font-family: 微软雅黑;
        }
        #middleone{
            width: 66%;
            height: 94%;
            font-size: 17px;
            font-family: 微软雅黑;
            float: left;
            position: relative;
            left: 4%;
            background-color: #F8F8F8;

        }

        #rightpage{
            width: 30% ;
            height: 100%;
            float: right;
            background-color: #E9E7E7;
            border: 1px solid #c2c2c2;
        }
        #tb tr td{
            width: 10px;
            height: 10px;
            border-collapse: separate;
            border-spacing: 3px 3px;
        }
        #tbl{
            width: 100%;
            height: 80%;
            font-size: 20px;
            font-family: 微软雅黑;
        }
    </style>
</head>
<body>
<!--头部logo-->
    <div id="head">
        <%--<img src="../img/logo3.gif" style="height: 30px;width:30px;">--%>
        <span>三人行在线考试系统</span>
    </div>
<%--   中部--%>
    <div id="midde">
        <div id="headexa">
            <div id="paperTitle">正在考试</div>
        </div>
<%--题目答案显示--%>
        <div id="middleone">
            <table id="tbl">
<%--                题目--%>
                <tr><td colspan="4">165.一张自增表里面总共有 7 条数据，删除了最后 2 条数据，重启 mysql 数据库，又插入了一条数据，此时 id 是几？<td/></tr>
<%--    答案--%>
                <tr>
                    <td><input type="radio" name="Answer" value="Answer1" title="A">A:答案3242151234123513241235wqrwqer52135ewqr32q452354wtr2435we<br/></td>
                    <td><input type="radio" name="Answer" value="Answer2" title="B">B:答案<br/></td>
                    <td><input type="radio" name="Answer" value="Answer3" title="C">C:答案<br/></td>
                    <td><input type="radio" name="Answer" value="Answer3" title="C">C:答案<br/></td>
                </tr>
                <tr>
                    <td><input type="radio" name="Answer" value="Answer3" title="C">C:答案<br/></td>
                    <td><input type="radio" name="Answer" value="Answer3" title="C">C:答案<br/></td>
                    <td><input type="radio" name="Answer" value="Answer3" title="C">C:答案<br/></td>
                    <td><input type="radio" name="Answer" value="Answer3" title="C">C:答案<br/></td>
                </tr>
                <tr>
                    <td colspan="4" style="text-align: center;">
<%--                        跳转题目按钮--%>
                        <input type="button" class="layui-btn layui-btn-radius" value="上一题">
                        <input type="button" class="layui-btn layui-btn-radius" value="下一题">
                    </td>
                </tr>
            </table>
        </div>
<%--跳转题目--%>
        <div id="rightpage">
<%--            考试剩余时间--%>
            <div style="width: 100%;height: 10%; font-size: 50px;color: #F8F8F8; background-color: #2F4056" class="layui-icon layui-icon-time">  00:00:00</div>
            <div>
                <table id="tb">
                    <tr>
<%--                        标题--%>
                        <td colspan="10">选择题</td>
                    </tr>
                    <tr>
                        <td><a href="#" class="layui-btn layui-btn-radius layui-btn-primary">01</a></td>
                        <td><a href="#" class="layui-btn layui-btn-radius layui-btn-primary">02</a></td>
                        <td><a href="#" class="layui-btn layui-btn-radius layui-btn-primary">03</a></td>
                        <td><a href="#" class="layui-btn layui-btn-radius layui-btn-primary">04</a></td>
                        <td><a href="#" class="layui-btn layui-btn-radius layui-btn-primary">05</a></td>
                        <td><a href="#" class="layui-btn layui-btn-radius layui-btn-primary">06</a></td>
                    </tr>
                    <tr>
                        <td><a href="#" class="layui-btn layui-btn-radius layui-btn-primary">01</a></td>
                        <td><a href="#" class="layui-btn layui-btn-radius layui-btn-primary">02</a></td>
                        <td><a href="#" class="layui-btn layui-btn-radius layui-btn-primary">03</a></td>
                        <td><a href="#" class="layui-btn layui-btn-radius layui-btn-primary">04</a></td>
                        <td><a href="#" class="layui-btn layui-btn-radius layui-btn-primary">05</a></td>
                        <td><a href="#" class="layui-btn layui-btn-radius layui-btn-primary">06</a></td>
                    </tr>
                    <tr>
                        <td><a href="#" class="layui-btn layui-btn-radius layui-btn-primary">01</a></td>
                        <td><a href="#" class="layui-btn layui-btn-radius layui-btn-primary">02</a></td>
                        <td><a href="#" class="layui-btn layui-btn-radius layui-btn-primary">03</a></td>
                        <td><a href="#" class="layui-btn layui-btn-radius layui-btn-primary">04</a></td>
                        <td><a href="#" class="layui-btn layui-btn-radius layui-btn-primary">05</a></td>
                        <td><a href="#" class="layui-btn layui-btn-radius layui-btn-primary">06</a></td>
                    </tr>
                    <tr>
                        <td><a href="#" class="layui-btn layui-btn-radius layui-btn-primary">01</a></td>
                        <td><a href="#" class="layui-btn layui-btn-radius layui-btn-primary">02</a></td>
                        <td><a href="#" class="layui-btn layui-btn-radius layui-btn-primary">03</a></td>
                        <td><a href="#" class="layui-btn layui-btn-radius layui-btn-primary">04</a></td>
                        <td><a href="#" class="layui-btn layui-btn-radius layui-btn-primary">05</a></td>
                        <td><a href="#" class="layui-btn layui-btn-radius layui-btn-primary">06</a></td>
                    </tr>
                    <tr>
                        <td><a href="#" class="layui-btn layui-btn-radius layui-btn-primary">01</a></td>
                        <td><a href="#" class="layui-btn layui-btn-radius layui-btn-primary">02</a></td>
                        <td><a href="#" class="layui-btn layui-btn-radius layui-btn-primary">03</a></td>
                        <td><a href="#" class="layui-btn layui-btn-radius layui-btn-primary">04</a></td>
                        <td><a href="#" class="layui-btn layui-btn-radius layui-btn-primary">05</a></td>
                        <td><a href="#" class="layui-btn layui-btn-radius layui-btn-primary">06</a></td>
                    </tr>

                </table>
            </div>
<%--    提交试卷按钮--%>
            <div style="width: 50%;height: 30%;text-align: center;margin: auto;"><button type="button" class="layui-btn layui-btn-fluid">提交试卷</button></div>

        </div>
    </div>
<%--    底部--%>
    <div id="chaque">
        <a href="#">电脑版说明</a>
        <a href="#">关于我们</a>
       <a href="#">APP安装方法</a>
        <p>粤ICP备15053947号-1<a href="#">工信部网站</a></p>
        <p>Copyright&copy;2000-2020 www.qqks.net All Rights Reserved.</p>
    </div>
</body>
</html>
